<!DOCTYPE html>
<head>
    <title>快递信息</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <link href="css/normalize.css" type="text/css" rel="stylesheet"/>
    <link href="css/common.css" type="text/css" rel="stylesheet"/>
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <script src="js/common.js" type="text/javascript"></script>
    <script src="js/notice.js" type="text/javascript"></script>
    <script src="js/regexp.js" type="text/javascript"></script>
    <script src="js/jweixin-1.2.0.js" type="text/javascript"></script>
    <script src="layer/layer.js"></script>
    <style type="text/css">
        .expPickCont {
            padding-bottom: 20px;
        }

        .expPickCont .expPickIcon {
            width: 15%;
            margin: 0 auto;
            text-align: center;
        }

        .expPickCont .expPicTitle {
            text-align: center;
            font-weight: bold;
        }

        .searchInfoBtn {
            width: 90%;
            margin: 0 auto;
            text-align: center;
            line-height: 46px;
            border-radius: 23px;
            background: #1f72ff;
            color: #fff;
            font-weight: bolder;
        }

        .expUserInfoCont {
            width: 90%;
            margin: 20px auto 20px;
            font-size: 14px;
        }

        .expUserInfoNull {
            width: 100%;
            line-height: 150px;
            text-align: center;
            color: #888888;
            display: none;
        }

        .expInfoCont {
            width: 100%;
            box-sizing: border-box;
            background-color: #fff;
            border-radius: 10px;
            padding: 30px;
        }

        .expInfoCont td:nth-of-type(1) {
            text-align: right;
            height: 2em;
            line-height: 2em;
        }

        .expInfoCont > .btns {
            border-top: 1px dashed #666;
            padding-top: 20px;
            text-align: right;
            margin-top: 10px;
        }

        .btn-success {
            padding: 5px 15px;
            color: #fff;
            background: #2F9925;
            border: 1px solid #fff;
            border-radius: 5px;
        }

        .status2 {
            position: relative;
        }

        .status2_bg {
            position: absolute;
            left: 0px;
            top: 0px;
            bottom: 0px;
            right: 0px;
        }

        .status2_bg > img {
            width: 30%;
            margin: 0 auto;
            margin-top: 50px;
            opacity: 0.5;

        }


        .status1 {
            display: auto;
        }

        .status2 {
            display: none;
        }
    </style>
</head>
<body>
<div class="content">
    <div class="expUserInfoCont" id="expUserInfoCont">
        <div class="expUserInfoNull">
            暂无查到相关信息
        </div>

    </div>
</div>
</body>
<script>
    $(function () {
        $.getJSON("/wx/findExpressByNumber.do", null, function (data) {
            var item = "<div class=\"expInfoCont status1\">\n" +
                "\t\t\t<table>\n" +
                "\t\t\t\t<tr>\n" +
                "\t\t\t\t\t<td>快递公司：</td><td>" + data.data.company + "</td>\n" +
                "\t\t\t\t</tr>\n" +
                "\t\t\t\t<tr>\n" +
                "\t\t\t\t\t<td>快递单号：</td><td>" + data.data.number + "</td>\n" +
                "\t\t\t\t</tr>\n" +
                "\t\t\t\t<tr>\n" +
                "\t\t\t\t\t<td>到件时间：</td><td>" + data.data.inTime + "</td>\n" +
                "\t\t\t\t</tr>\n" +
                "\t\t\t</table>\n" +
                "\t\t</div>";
            $("#expUserInfoCont").append($(item));
        });
    });
</script>
</html>